<template>
    <view class="container b-f">
        <!-- DIY组件 -->
        <diy-component :diyItems="items"></diy-component>
    </view>
</template>

<script>
import diyComponent from '@/pages/diy/index';
const app = getApp();
export default {
    components: {
        diyComponent
    },
    data() {
        return {
            // 页面元素
            items: {}
        };
    },
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function (options) {
        // 页面id
        this.page_id = options.page_id;
        // 加载页面数据
        this.getPageData();
    },
    /**
     * 分享当前页面
     */
    onShareAppMessage: function () {
        let params = this.items.page.params;
        return {
            title: params.share_title,
            path: '/pages/custom/index?referee_id=' + app.globalData.getUserId()
        };
    },
    /**
     * 下拉刷新
     */
    onPullDownRefresh: function () {
        // 获取首页数据
        this.getPageData(function () {
            uni.stopPullDownRefresh();
        });
    },
    methods: {
        /**
         * 加载页面数据
         */
        getPageData: function (callback) {
            let that = this;
            app.globalData._get(
                'page/custom',
                {
                    page_id: that.page_id
                },
                function (result) {
                    // 设置顶部导航栏栏
                    that.setPageBar(result.data.items.page);
                    that.setData(result.data);
                    // 回调函数
                    if (typeof callback === 'function') {
                        callback();
                    }
                }
            );
        },

        /**
         * 设置顶部导航栏
         */
        setPageBar: function (page) {
            // 设置页面标题
            uni.setNavigationBarTitle({
                title: page.params.title
            });
            // 设置navbar标题、颜色
            uni.setNavigationBarColor({
                frontColor: page.style.titleTextColor === 'white' ? '#ffffff' : '#000000',
                backgroundColor: page.style.titleBackgroundColor
            });
        }
    }
};
</script>
<style>
@import './index.css';
</style>
